<template>
  <div>
    <BreakSpace label="工单信息"></BreakSpace>
    <!-- labelWidth="100" -->
    <FormPanel ref="formpanel" :list="formList"  formType="show" :isSubmitBtn="false" :labelWidth= 100  @formChange="formchangeFun"></FormPanel>
      <!-- <el-form
        :model="rowData"
        ref="formpanel"
        :inline="true"
        size="mini"
        style="width:300px"
        label-position="right"
      >
        <el-form-item label="工单号" v-if="rowData.roNo" prop="roNo">
          <el-input v-model="rowData.roNo" disabled></el-input>
        </el-form-item>
      </el-form> -->

    <el-tabs v-model="defaultTabLabel">
      <el-tab-pane name="1" label="维修项目" lazy>
        <repairProject :roLaboursProject="this.roLabours" :roNo="rowData.roNo"  :chargePartition="chargePartition" />
      </el-tab-pane>
      <el-tab-pane name="2" label="维修备件" lazy>
        <repairStuff :roPartsProject="this.roParts" :roNo="rowData.roNo"  :chargePartition="chargePartition" />
      </el-tab-pane>
      <el-tab-pane name="3" label="附加项目" lazy>
        <additionalProject :roItemsProject="this.roItems" :roNo="rowData.roNo"  :chargePartition="chargePartition" />
      </el-tab-pane>
    </el-tabs>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <ButtonArea align="right">
        <!-- <printRepairOrder :roNo="rowData.roNo" :ownerCode="rowData.ownerCode" /> -->

        <!-- <printBalanceOrder v-if="rowData.roStatus == 80491003" :roNo="rowData.roNo" :ownerCode="rowData.ownerCode" btnText="打印结算单" /> -->
        <el-button @click="closeDialog">取 消</el-button>
      </ButtonArea>
    </div>
  </div>
</template>
<script>
import { dictionary } from '@/utils/dictMixin';
import moment from 'moment';
import repairProject from './tabs/repairProject';
import repairStuff from './tabs/repairStuff';
import additionalProject from './tabs/additionalProject'; // 工单打印接口

import { getRepairTypes } from '@/api/repair/repairManage/repairFeeQuery/index.js';
import { getAllRepairLabour } from '@/api/repair/repairManage/repairQuery';
import printRepairOrder from './printRepairOrder_oem';
import printBalanceOrder from './printBalanceOrder_oem';
import { getNameByIds } from '@/api/repair/common/index.js';

export default {
  name: 'OrderPanel',
  components: { repairProject, repairStuff, additionalProject, printRepairOrder, printBalanceOrder },
  mixins: [],
  props: {
    rowData: {
      type: Object,
      default: () => ({})
    },
    type: {
      type: String,
      default: () => 'show'
    },
    allUser: {
      type: Array,
      default: () => []
    },
    chargePartition: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      form:"",
      detail:{},
      roLabours:[],
      roParts:[],
      roItems:[],
      formList: this.createFormList(),
      defaultTabLabel: '1'
    };
  },
  mounted() {
    this.formList.forEach(x => {
      if([x.fieldName] == 'repairAmount' || [x.fieldName] == 'receiveAmount' || [x.fieldName] == 'inMileage'){
        x.initialValue = parseInt(this.rowData[x.fieldName] == null || this.rowData[x.fieldName] == '' ? 0.00 : this.rowData[x.fieldName]).toFixed(2);
      }else{
        x.initialValue = this.rowData[x.fieldName];
      }
      
    });
    // this.formList.find(x => x.fieldName === 'technician').itemList = this.allUser;
  },
  created() {
    //this.getRepairTypesFun();
    this.getNameByIds();
    this.getDetail();
  },
  methods: {
    // 获取所有的人员
    async getNameByIds() {
      if (this.rowData.technician && this.rowData.technician.length) {
        let res = await getNameByIds({ userIds: this.rowData.technician });
        if (res.resultCode == 200) {
          let userList = res.data.map(x => ({ text: x.employeeName, value: x.employeeId + '' }));
          this.formList.find(x => x.fieldName === 'technician').itemList = userList;
        }
      }
    },
    // 获取维修类型
    // async getRepairTypesFun() {
    //   const res = await getRepairTypes();
    //   let repairList = res.data.map(x => ({ value: x.REPAIR_TYPE_CODE, text: x.REPAIR_TYPE_NAME }));
    //   this.formList.find(x => x.fieldName === 'repairTypeCode').itemList = repairList;
    // },
    async getDetail(){
      let params = {
        ownerCode:this.rowData.ownerCode,
        roNo:this.rowData.roNo,
      };

      const detailMap = await getAllRepairLabour(params);
    if(detailMap.resultCode === 200){
      this.detail = detailMap;
      this.roLabours = detailMap.data.roLabours;
      this.roParts = detailMap.data.roParts;
      this.roItems = detailMap.data.roItems;
    }
    },
    formchangeFun() {},
    // Form数据
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '工单号',
          fieldName: 'roNo'
        },
        {
          type: 'INPUT',
          label: '服务中心代码',
          fieldName: 'serviceDealerCode',
          labelWidth:'100px'
        },
        {
          type: 'INPUT',
          label: '服务中心名称',
          fieldName: 'serviceDealerName',
          labelWidth:'100px'
        },
        {
          type: 'INPUT',
          label: 'VIN',
          fieldName: 'vin'
        },
        {
          type: 'INPUT',
          label: '车牌号',
          fieldName: 'license'
        },
        // {
        //   type: 'INPUT',
        //   label: '发动机号',
        //   fieldName: 'engineNo'
        // },
        {
          type: 'SELECT',
          label: '维修类型',
          fieldName: 'repairTypeName',
          itemList: []
        },
        {
          type: 'INPUT',
          label: '车主',
          fieldName: 'ownerName'
        },
        {
          type: 'INPUT',
          label: '车主电话',
          fieldName: 'ownerMobile'
        },
        {
          type: 'DATE',
          label: '开单时间',
          fieldName: 'roCreateDate',
          valueFormat: 'yyyy-MM-dd'
        },
        {
          type: 'INPUT',
          label: '进厂里程',
          fieldName: 'inMileage'
        },
        {
          type: 'SELECT',
          label: '服务顾问',
          fieldName: 'serviceAdvisorName',
          itemList: []
        },
        // {
        //   type: 'INPUT',
        //   label: '出厂里程',
        //   fieldName: 'outMileage'
        // },
        {
          type: 'DATE',
          label: '结算日期',
          fieldName: 'balanceTime'
        },
        {
          type: 'INPUT',
          label: '送修人姓名',
          fieldName: 'deliverer'
        },
        {
          type: 'INPUT',
          label: '送修人电话',
          fieldName: 'delivererMobile'
        },
        // {
        //   type: 'INPUT',
        //   label: '送修人手机',
        //   fieldName: 'delivererMobile'
        // },
        // {
        //   type: 'INPUT',
        //   label: '估价单号',
        //   fieldName: 'estimateNo'
        // },

        {
          type: 'DATE',
          label: '预交车时间',
          fieldName: 'endTimeSupposed'
        },
        {
          type: 'INPUT',
          label: '维修金额',
          fieldName: 'repairAmount',
          // render: props =>{
          //   return <span>{parseInt(row.repairAmount == null || row.repairAmount == '' ? 0.00 : row.repairAmount).toFixed(2)}</span>;
          // }
        },
        {
          type: 'INPUT',
          label: '收款金额',
          fieldName: 'receiveAmount'
        },
        {
          type: 'TEXT_AREA',
          label: '客户描述',
          fieldName: 'roTroubleDesc',
          // labelWidth:'500px',
        },
        // {
        //   type: 'TEXT_AREA',
        //   label: '检查结果',
        //   fieldName: 'checkResult',
        // }
      ];
    },
    closeDialog() {
      this.$emit('closeDialog', false);
    },
    printPayOrder() {},
    printOrder() {}
  }
};
</script>

<style lang="less" scoped>
.textarea-plus {
  width: 483px !important;
}</style>
